// 列表、删除

export default {
  props: {
    // 额外数据，需要注入到gQueryData, 这些数据不会被重置
    // 作用，便于将list作为组件，外部再增加拓展功能
    gExtraData: {
      type: Object,
      default: () => ({})
    }
  },
  data () {
    return {
      // 导入弹框
      gImportShow: false,
      // 公共、新增、修改弹框控制
      gModalShow: false,
      // 选中数据
      gSelectData: [],
      // 分页基础信息
      gPageData: {
        // pageNum: 1,
        // pageSize: 10
      },
      // 查询条件
      gQueryData: {},
      // 表格变量
      gTableData: [],
      // 表格加载
      gLoading: false,
      // 总数信息
      gTotal: 0,
      // 列表操作配置
      listConfig: {
        pageKey: 'pageNum',
        sizeKey: 'pageSize',
        beforeRequestFn: null, // 列表请求前执行函数,
        afterRequestFn: null, // 列表请求后执行函数
        autoLoad: true, // 是否自动获取数据
        apiFn: null, // 列表的api函数
        total: 'total', // 总数存储字段位置
        data: 'rows' // list数据存储字段位置
      },
      // 删除操作配置
      delConfig: {
        keyName: 'id', // 主键名称
        apiFn: null, // 删除的api函数
        beforeRequestFn: null, // 刪除请求前执行函数,
        afterRequestFn: null // 刪除请求后执行函数
      }
    }
  },
  created () {
    // 保存干净的初始查询数据
    this.gInitQueryData = JSON.stringify(this.gQueryData)
    // 设置分页初始数据
    this.gPageData = {
      [this.listConfig.pageKey || 'pageNum']: 1,
      [this.listConfig.sizeKey || 'pageSize']: 10
    }
    // 如果开启则自动请求
    if (this.listConfig.autoLoad) {
      this.gInitData()
    }
  },
  mounted () {
    // 将表格和工具栏进行关联
    const $table = this.$refs.gTableRef
    const $toolbar = this.$refs.gToolbarRef
    if ($table && $toolbar) {
      $table.connect($toolbar)
    }
  },
  methods: {
    // 全选事件
    gCheckboxAllChange ({ records }) {
      this.gSelectData = records
    },
    // 表格勾选事件
    gCheckboxChange ({ records }) {
      this.gSelectData = records
    },
    // 表格双击查看事件
    gCellDblclick ({ row }) {
      if (this.$refs.gEdit) {
        this.$refs.gEdit.gShowDetail(row, 'see')
      }
    },
    // 工具条右侧按钮点击事件，目前只有第一个导出有用
    gToolTick ({ code, tool, $event }) {
      console.log(code, 222)
      if (code === 'export') {
        this.gExportExcel()
      }
    },
    // 导出Excel数据
    gExportExcel () {
      this.$message.warning('curd混入导出功能开发中，应是一个全局的导出功能')
    },
    // 修改点击事件
    gEditRow (data) {
      if (this.$refs.gEdit) {
        if (Array.isArray(data)) {
          if (data.length === 0) {
            return this.$message.warning('请选择一条数据')
          } else if (data.length > 1) {
            return this.$message.warning('只可选择一条数据')
          } else {
            this.$refs.gEdit.gShowDetail(data[0], 'edit')
          }
        } else {
          this.$refs.gEdit.gShowDetail(data)
        }
      }
    },
    // 初始化数据
    async gInitData () {
      const { beforeRequestFn, apiFn, afterRequestFn } = this.listConfig

      if (!apiFn && typeof apiFn !== 'function') {
        return this.$message.warning('列表listConfig的apiFn未定义请求函数')
      }
      // 合并查询条件和分页参数和list为组件的时候外部传入的额外数据
      let allQueryData = { ...this.gQueryData, ...this.gPageData, ...this.gExtraData }

      // 列表请求前执行函数
      if (beforeRequestFn && typeof beforeRequestFn === 'function') {
        // 用于对gQueryData做一些参数调整操作；比如对时间进行格式化等操作
        allQueryData = await beforeRequestFn(allQueryData)
      }
      // 列表请求
      this.gLoading = true
      this.listConfig
        .apiFn(allQueryData)
        .then(async (res) => {
          let resultData = { ...res }
          // 列表请求后执行函数
          if (afterRequestFn && typeof afterRequestFn === 'function') {
            // 用于对gQueryData做一些参数调整操作；比如对时间进行格式化等操作
            resultData = await afterRequestFn(res)
          }
          // 设置总数
          if (resultData[this.listConfig.total]) {
            this.gTotal = resultData[this.listConfig.total]
          }
          // 设置列表
          if (resultData[this.listConfig.data]) {
            this.gTableData = resultData[this.listConfig.data]
          }
        })
        .catch((err) => {
          console.log('请求出错', err)
        })
        .finally(() => {
          this.gLoading = false
        })
    },
    /**
     * 搜索确认
     */
    gSearchCofnirm () {
      this.gPageData[this.listConfig.pageKey || 'pageNum'] = 1
      this.gInitData()
    },
    /**
     * 搜索取消
     */
    gSearchCancel () {
      if (this.$refs.gQueryFormRef) {
        this.$refs.gQueryFormRef.resetFields()
        this.gQueryData = JSON.parse(this.gInitQueryData)
      }
      this.gPageData.pageNum = 1
      this.gInitData()
    },
    /**
     * 页码和每页数量切换时间
     */
    gPageChange (page, pageSize) {
      this.gPageData[this.listConfig.pageKey || 'pageNum'] = page
      this.gPageData[this.listConfig.sizeKey || 'pageSize'] = pageSize
      this.gInitData()
    },
    // 删除操作
    async gDeleteRow (data) {
      let checkList = []
      if (!data || typeof data.preventDefault === 'function') {
        // 为传参，或者传null则是批量删除
        if (this.gSelectData && this.gSelectData.length > 0) {
          checkList = this.gSelectData
        } else {
          return this.$message.warning('请选择要删除的行')
        }
      } else {
        if (typeof data === 'object' && data[this.delConfig.keyName]) {
          checkList = [data]
        } else {
          return this.$message.warning('传入数据错误或或主键未匹配')
        }
      }
      // 提示框
      this.$confirm({
        title: '提示',
        content: '确认删除吗,删除后不可恢复',
        okText: '确认',
        okType: 'danger',
        cancelText: '取消',
        onOk: () => {
          this.gDelHanlder(checkList)
        },
        onCancel () {
          // console.log('Cancel')
        }
      })
    },
    gDelHanlder (checkList) {
      const { beforeRequestFn, apiFn, afterRequestFn } = this.delConfig
      let delReqData = checkList.map((item) => item[this.delConfig.keyName]).join(',')
      // 中间件
      if (beforeRequestFn && typeof beforeRequestFn === 'function') {
        delReqData = beforeRequestFn(delReqData, checkList)
      }
      // 发请求
      apiFn(delReqData)
        .then((res) => {
          this.$message.success('删除成功')
          // 清除选中数据
          if (this.gSelectData) {
            this.gSelectData = []
          }
          // 清空表格选中行
          if (this.$refs.gTableRef && this.$refs.gTableRef.clearCheckboxRow) {
            this.$refs.gTableRef.clearCheckboxRow()
          }
          // 中间件
          if (afterRequestFn && typeof afterRequestFn === 'function') {
            afterRequestFn(res)
          }
          // 列表请求
          this.gInitData()
        })
        .catch((err) => {
          console.log('删除出错', err)
        })
    }
  }
}
